<template>
	<MobileSimulation>
		<Input
			v-model="value"
			placeholder="请输入"
			style="margin:10px 10px 0;width:150px"
			@click.native="click"
			@blur="blur"
			@focus="focus">
			<template #append>
				<Icon name="fingerprint"/>
			</template>
		</Input>
		<Input v-model="value" style="margin:10px 10px 0;width:150px">
			<template #prepend>
				<Icon name="fingerprint"/>
			</template>
		</Input>
		<Input value="测试测试测试测试测试测试测试测试测试12" readonly style="margin:10px 10px 0;width:150px">
			<template #prepend>
				<Icon name="fingerprint"/>
			</template>
		</Input>
		<Input value="测试测试测试测试测试测试测试测试测试12" disable style="margin:10px 10px 0;width:150px">
			<template #prepend>
				<Icon name="fingerprint"/>
			</template>
		</Input>
		<Input v-model="value" clearable disable placeholder="可清空" style="margin:10px 10px 0;width:150px"/>
		<Input v-model="value" disable type="password" placeholder="请输入密码" style="margin:10px 10px 0;width:150px"/>
		<Input v-model="value" shape="round" style="margin:10px 10px 0;width:150px">
			<template #append>
				<Icon name="fingerprint"/>
			</template>
		</Input>
		<Input v-model="value" clearable placeholder="可清空" style="margin:10px 10px 0;width:150px"/>
		<Input v-model="value" clearable placeholder="可清空" style="margin:10px 10px 0;width:150px">
			<template #append>
				<Icon name="fingerprint"/>
			</template>
		</Input>
		<Input v-model="value" type="password" placeholder="请输入密码" style="margin:10px 10px 0;width:150px"/>
		<Input v-model="value2" :maxlength="5" placeholder="最大长度" style="margin:10px 10px 0;width:150px"/>
		<Input
			v-model="value"
			shape="noBorder"
			placeholder="无边框"
			style="margin:10px 10px 0;width:150px">
		</Input>
	</MobileSimulation>
</template>

<script>
import MobileSimulation from '../../../../components/MobileSimulation';
import Input from '@/components/app/input';
import Icon from '@/components/app/icon';

export default {
	name:'index',
	components:{
		MobileSimulation,
		Input,
		Icon,
	},
	data(){
		return {
			value:'',
			value2:'',
		};
	},
	computed:{
	},
	methods:{
		click(){
			console.log('点击');
		},
		focus(){
			console.log('focus');
		},
		blur(){
			console.log('blur');
		}
	}
};
</script>

<style lang="scss">
</style>
